import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import CardVue from "./components/Card.vue";
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'


export const app = createApp(App)

app.use(ElementPlus, {
    locale: zhCn,
})
// 注册为全局组件 直接使用不需要import
app.component('CardGlobal', CardVue)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
}


//Bus总线使用mitt库
import mitt from 'mitt'
const Mit = mitt();
declare module 'vue' {
    export interface ComponentCustomProperties {
        // 获取所有类型
        $bus: typeof Mit
    }
}
app.config.globalProperties.$bus = Mit


//全局参数与全局函数
app.config.globalProperties.$env = 'dev'
app.config.globalProperties.$filters = {
    format<T>(str: T) {
        return `liu-${str}`
    }
}
// 扩充
type Filter = {
    format<T>(str: T): string
}
declare module 'vue' {
    export interface ComponentCustomProperties {
        $filters: Filter
        $env: string
    }
}


// 自定义插件
import Loading from './components/Loading';//指向插件文件夹
// app.use(Loading);
/* import { MyUse } from './myUse';
MyUse(Loading); */
type Lod = {
    show: () => void,
    hide: () => void
}
//编写ts loading声明文件放置报错和智能提示
declare module '@vue/runtime-core' {
    export interface componentCustomProperties {
        $loadingg: Lod
    }
}

// tailwind
import './tailwind/index.css'

import 'uno.css'

import router from './router'
app.use(router)
const whileList = ['/X']
// 全局前置守卫
router.beforeEach((to, from, next) => {
    if (whileList.includes(to.path) || localStorage.getItem('token')) {
        next()
    } else {
        next('/X2')
    }
})
// 全局后置守卫
import LoadingBar from './components/views/LoadingBar.vue';
import { createVNode, render } from 'vue';
const Vnode = createVNode(LoadingBar)
render(Vnode, document.body)
router.afterEach((to, from) => {
    Vnode.component?.exposed?.startLoading()
    Vnode.component?.exposed?.endLoading()
})

// 只有在挂在前改配置内容才生效
app.mount('#app')